<template>
	<el-main class="nopadding infinite-list" v-infinite-scroll="load" style="overflow:auto;height: 100%">
		<el-empty description="暂无记录" :image-size="100" v-if="recordList.length==0"></el-empty>
		<el-card v-for="item in recordList" class="infinite-list-item" :key="item.meetingId" style="cursor: pointer;position: relative;" @click="showRecordList(item)">
			<template v-slot:header>
				<div style="text-overflow: ellipsis;overflow: hidden;white-space: nowrap;" :title="item.subject">
					【{{item.meetingTypeName}}】{{ item.subject }}
				</div>
			</template>
			<sc-water-mark ref="wm" :text="waterMarkContent" :subtext="waterMarkSubtext" :showWater="waterMark=='1'">
			<div style="text-overflow: ellipsis;overflow: hidden;white-space: nowrap;">
				会议时间:{{ item.beginTime }}~{{item.endTime}}
			</div>
			<div style="margin-top:10px;display: flex">
				<div style="display: contents;">
					<el-avatar :src="item.avatar" size="small"></el-avatar>
				</div>
				<div style="display: inline-block;padding-top:5px;width: 100%;">
					<span style="margin-left: 15px">{{ item.chairUserName }}</span>
					<span style="float: right;margin-left: 20px">
								<div>
									地点:{{ item.roomName }}
								</div>
							</span>
				</div>
			</div>
			</sc-water-mark>
		</el-card>
	</el-main>
	<meetingDetails v-if="dialog.detailsSave" ref="meetingDialog" @closed="dialog.detailsSave=false"></meetingDetails>
</template>

<script>
import meetingDetails from "@/views/office/meeting/meetingDetails";
export default {
	components: {
		meetingDetails,
	},
	data() {
		return {
			dialog: {
				detailsSave:false,
			},
			loadFlag:true,
			loadStatus:true,
			recordList: [],
			search: {
				page: 0,
				keyword: ""
			},
			waterMarkContent:'',
			waterMarkSubtext:'',
			waterMark:'0',
		}
	},
	computed: {},
	mounted() {
		this.waterMark = this.$TOOL.data.get("WATER_MARK");
		this.waterMarkContent = this.$TOOL.data.get("WATER_MARK_CONTENT");
		this.waterMarkSubtext = this.$TOOL.data.get("WATER_MARK_SUBTEXT");
	},
	methods: {
		async upsearch() {
			this.recordList = [];
			this.search.page = 0;
			this.loadFlag = true;
			this.load();
		},
		load() {
			if(this.loadFlag&&this.loadStatus) {
				this.loadStatus = false;
				this.getMyMeetingListForApp();
			}
		},
		async getMyMeetingListForApp() {
			let res = await this.$API.office.meeting.getMyMeetingListForApp.get(this.search);
			if (res.code == 200) {
				this.recordList = this.recordList.concat(res.data);
				this.search.page = this.search.page + 10;
				this.loadStatus = true;
				if(res.data.length<10)
				{
					this.loadFlag = false
				}
			} else {
				this.$alert(res.message, "提示", {type: 'error'})
			}
		},
		showRecordList(item){
			this.dialog.detailsSave = true
			this.$nextTick(() => {
				this.$refs.meetingDialog.open().setData(item);
			})
		}
	}
}
</script>
